<template>
<div>
    <Table border :columns="columns" :data="data" @on-sort-change="handleSortChange"></Table>
    <AutoPage v-model="page"></AutoPage>
</div>
</template>
<script>
import Page from '@/common/model/Page'
import AutoPage from '@/common/components/AutoPage'

export default {
    name: "AutoTable",
    props: {
        columns: Array,
        data: Array,
        page: Page
    },
    data () {
        return {
        }
    },
    components: {
        AutoPage
    },
    methods: {
        handleSortChange({column, key, order}) {
            this.page.order_by = {};
            this.page.order_by[key] = order;
            this.page.getData();
        }
    }
}
</script>
